<template>
  <div>
    <el-table
      :data="list"
      :highlight-current-row="true"
      :max-height="1500"
      :size="size"
      v-loading="loading"
      align="align"
    >
      >
      <el-table-column width="300" align="center" label="活动ID" element-loading-text="请给我点时间！">
        <template slot-scope="scope">
          <span>{{ scope.row.id }}</span>
        </template>
      </el-table-column>

      <el-table-column width="240" align="center" label="活动名称">
        <template slot-scope="scope">
          <span>{{ scope.row.promName || '-'}}</span>
        </template>
      </el-table-column>

      <el-table-column width="100" align="center" label="活动类型">
        <template slot-scope="scope">
          <span>砍价活动</span>
        </template>
      </el-table-column>

      <el-table-column width="100" align="center" label="活动渠道" >
        <template slot-scope="scope">
          <span>{{scope.row.channelCodes}}</span>
        </template>
      </el-table-column>

      <el-table-column width="360" align="center" label="活动时间">
        <template slot-scope="scope">
          <span>{{ scope.row.startTime }} 至 {{ scope.row.endTime }}</span>
        </template>
      </el-table-column>

      <el-table-column width="100" class-name="status-col" align="center" label="活动状态">
        <template slot-scope="scope">
          <span>{{ scope.row.statusName }}</span>
        </template>
      </el-table-column>

      <el-table-column width="240" class-name="status-col" align="center" label="创建时间">
        <template slot-scope="scope">
          <span>{{ scope.row.createTime }}</span>
        </template>
      </el-table-column>

      <el-table-column width="390" class-name="status-col" label="操作" align="center" fixed="right">
        <template slot-scope="scope">
          <!-- <span v-if="[3,5].includes(scope.row.status) && scope.row.editFlag">
            <el-button type="text" class="textButton" @click="seeNewTab(scope.row)">查看</el-button>
            <kt-button
              type="text"
              class="textButton"
              @click="closeActivity(scope.row)"
              perms="market:single:close"
              label="关闭"
            />
          </span> -->
          <!-- <span v-else-if="[9].includes(scope.row.status)  && scope.row.editFlag">
            <kt-button
              type="text"
              class="textButton"
              @click="updateBtnShow(scope.row)"
              perms="market:single:edit"
              label="编辑"
            />
            <kt-button
              type="text"
              class="textButton"
              @click="deleteActivity(scope.row.id)"
              perms="market:single:delete"
              label="删除"
            />
          </span> -->
          <!-- <span v-else-if="[2,6,7,8].includes(scope.row.status)  && scope.row.editFlag">
            <el-button type="text" class="textButton" @click="seeNewTab(scope.row)">查看</el-button>

          </span> -->
          <!-- <span v-else-if="[4].includes(scope.row.status)  && scope.row.editFlag">
            <el-button type="text" class="textButton" @click="seeNewTab(scope.row)">查看</el-button>

            <kt-button
              type="text"
              class="textButton"
              @click="updateBtnShow(scope.row)"
              perms="market:single:edit"
              label="编辑"
            />
          </span> -->
          <!-- <span v-else-if="[1].includes(scope.row.status)  && scope.row.editFlag">
            <el-button type="text" class="textButton" @click="seeNewTab(scope.row)">查看</el-button>
            <kt-button
              type="text"
              class="textButton"
              @click="updateBtnShow(scope.row)"
              perms="market:single:edit"
              label="编辑"
            />
            <kt-button
              type="text"
              class="textButton"
              @click="deleteActivity(scope.row.id)"
              perms="market:single:delete"
              label="删除"
            />
          </span> -->
          <span >
            <kt-button
              type="text"
              class="textButton"
              @click="updateBtnShow(scope.row)"
              perms="market:single:edit"
              label="编辑"
            />
          </span>
          <span>
          </span>
        </template>
      </el-table-column>
    </el-table>
    <!--分页栏-->
    <div class="toolbar t_r">
      <el-pagination
        layout="total, sizes, prev, pager, next, jumper"
        @current-change="refreshPageRequest"
        :current-page="listQuery.pageNo"
        :page-size="listQuery.pageSize"
        :total="totalSize"
        :page-sizes="[10, 20, 30, 40]"
        @size-change="handleSizeChange"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
import marketRequest from "@/market/request/marketRequest";
import KtButton from "@/views/Core/KtButton";
import {
  promTypeConverter,
  frontPromTypeConverter,
  frontPromTypeConverterFull,
  channelCodeConverter
} from "@/market/dict/marketDict";

export default {
  components: {
    KtButton
  },
  filters: {
    statusFilter(status) {
      const statusMap = {
        published: "success",
        draft: "info",
        deleted: "danger"
      };
      return statusMap[status];
    }
  },
  props: {
    type: {
      type: String,
      default: "0"
    },
    parentFilters: {
      type: Object
    }
  },
  data() {
    return {
      size: "small",
      list: [],
      listQuery: {
        start: 1,
        limit: 10,
        status: this.type,
        sort: "+id"
      },
      loading: false,
      totalSize: 0
    };
  },
  created() {
    this.getList();
  },
  methods: {
    getList() {
      this.loading = true;
      this.$emit("create");
      let _filters = JSON.parse(JSON.stringify(this.parentFilters));
      _filters["start"] = this.listQuery.pageNo;
      _filters["limit"] = this.listQuery.pageSize;
      _filters["status"] = this.listQuery.status;
      if (_filters.status == "-1") {
        _filters.status = "";
      }
      let this_ = this;
      this.utils.request.queryProductBargainPage(_filters, function(res) {
        if (res.code == "0000") {
          this_.list = res.data.rows;
          this_.totalSize = res.data.total;
        } else {
          var key = "status" + this_.listQuery.status;
        }
        this_.$nextTick(() =>{
          this_.loading = false;
        })
      });
    },
    //查看
    seeNewTab: function(val) {
      this.$router.push({ path: "/SinglePromotionDetail/" + val.id + "/0"});
    },
    //复制
    copyBtnShow: function(id) {
      let that = this;
      this.$confirm("确定要复制该活动？", "提示", {
        type: "warning",
        closeOnClickModal: false,
      })
        .then(() => {
          marketRequest.promotionDeepCopy(
            { id: id },
            res => {
              that.$message({ message: "复制成功", type: "success" });
              that.getList();
            }
          );
        })
        .catch(() => {});
    },
    //关闭
    closeActivity: function(row) {
      let that = this;
      let msg = '该活动即将进行，确定要关闭它？关闭后不可再次开启。'
      if(row.status == 5){
        msg = '该活动正在进行中，确定要关闭它？关闭后不可再次开启。'
      }
      this.$confirm(
        msg,
        "提示",
        {
          type: "warning",
          closeOnClickModal: false,
        }
      )
        .then(() => {
          this.utils.request.promotionUpdateStatus(
            { id: row.id, status: 7 },
            res => {
              that.$message({ message: "关闭成功", type: "success" });
              that.getList();
            }
          );
        })
        .catch(() => {});
    },
    //关闭
    updatePromotionStatus: function(id, status) {

      // let this_ = this;
      // let params = { id: id, status: status };
      // this.utils.request.promotionUpdateStatus(params, function(res) {
      //   if (res.code == "0000") {
      //     this_.getList();
      //   } else {
      //     alert("更新失败");
      //   }
      // });
    },
    //删除
    deleteActivity: function(id) {
      this.$confirm("确定要执行删除操作么？删除后不可恢复!", "提示", {
        type: "warning",
        closeOnClickModal: false,
      })
        .then(() => {
          let this_ = this;
          let params = { id: id };
          this.utils.request.promotionDelete(params, function(res) {
            if (res.code == "0000") {
              this_.getList();
            } else {
              alert("更新失败");
            }
          });
        })
        .catch(() => {});
    },
    updateBtnShow: function(val) {
      this.$router.push(`/BargainPromotionEdit?id=${val.id}&auth=0&active=1`);
    },

    //查看营销报告
    viewMarketingReport: function() {
      this.$router.push("/MarketingReport");
    },
    // 换页刷新-pageNo
    refreshPageRequest: function(pageNum) {
      this.listQuery.pageNo = pageNum;
      this.getList();
    },
    // 换页刷新-pageSize
    handleSizeChange: function(pageSize) {
      this.listQuery.pageSize = pageSize;
      this.listQuery.pageNo = 1;
      this.getList();
    },
    genFrontPromType: function(type) {
      return frontPromTypeConverter(type);
    },
    genChannelCode: function(code) {
      return channelCodeConverter(code);
    },
    //查看分析
    viewAnalysi() {
      this.$router.push("/SecKillPromotionDetail");
      //
    },
    //二次营销
    SecondSell() {
      //
      this.$emit("SecondSell");
    }
  }
};
</script>
<style scoped lang="scss">
</style>
